function init(){
    setDatePicker();
    changeTabPane();
    uploadImage($('#frm-upload-banner'), getUploadedImage);
    doCropImage(evtAfterCropImage);

    uploadImage($('#frm-upload-slide'), changeSlide);
    chooseTheme();
    setBanner();
    setSlide();
}

function chooseTheme(){
    $('#preview-theme li a.theme-img').click(function(e){
        e.preventDefault();
        $('#preview-theme li a').removeClass('thumbnail-selected');
        $(this).addClass('thumbnail-selected');
        $('#btn-choose-theme').attr('data-value', $(this).attr('data-theme'));
        return false;
    });

    $('#shop-template').change(function(){
        $('#btn-choose-theme').attr('data-value', $(this).val());
        var index = $(this).find('option:selected').attr('data-index');
        $('#preview-theme li a').removeClass('thumbnail-selected');
        $('#preview-theme li a[data-theme=' + $(this).val() + ']').addClass('thumbnail-selected');
    });

    $('#btn-choose-theme').click(function(){
        $('#shop-template').val($('#btn-choose-theme').attr('data-value'));
        $('#modal-preview-theme').modal('hide');
    });
}

function evtAfterCropImage(data){
    var newImage = $('#banner-img-block').clone().removeAttr('id').removeClass('hidden');
    newImage.find('a.thumbnail').attr('data-name', data.file_name);
    newImage.find('img.media-object').attr('src', data.file_path);
    $('#modal-change-banner #image-temp-upload').append(newImage);
    //clear crop panel
    $('#input-crop-path').val('');
    $('.image-current').removeClass('hidden');
    $('.image-resize').addClass('hidden');
}

function setBanner(){
    $(document.body).on('click', '.banner-img-block', function(e){
        e.preventDefault();
        var folder = $(this).attr('data-folder');
        var file_name = $(this).attr('data-name');
        var file_path = $(this).find('img.media-object').attr('src');
        $('#shop_banner').val(folder + file_name);
        $('#modal-change-banner').modal('hide');
        return false;
    });
}

function changeSlide(response){
    var data = $.parseJSON(response);
    if(data.code==1){
        var randId = 'chk-o-' + Math.floor((Math.random() * 1000) + 1);
        var newImage = $("#slide-img-block").clone().wrap("<li class='ui-state-default'></li>").clone();
        newImage.find('a.fancybox').attr('href', data.file_path);
        newImage.find('a.fancybox img').attr('src', data.file_path);
        newImage.find('p.slide-status .chk-slide').attr('id', randId).attr('value', data.file_name);
        newImage.find('p.slide-status .lb-toggle-lb').attr('for', randId);
        $('#modal-change-slide #sortable').append(newImage);
    }
}

function setSlide(){
    $('#sortable').sortable({placeholder: "ui-state-highlight"});
    $('#sortable').disableSelection();
    $('#btn-confirm-slide').click(function(){
        var data = $("#sortable .chk-slide").clone();
        $('#ar-slide').html(data);
        $('#modal-change-slide').modal('hide');
    });
}